const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const CompressionWebpackPlugin = require('compression-webpack-plugin')
const webpack = require('webpack')
const productionGzipExtensions = ['js', 'css'] // 需要gzip压缩的文件后缀
const path = require('path')
const IS_PROD = ['production'].includes(process.env.NODE_ENV)
const productionSourceMap = !IS_PROD
function resolve (dir) {
    return path.join(__dirname, dir)
}

console.log('NODE_ENV:' + process.env.NODE_ENV)

const option = {
    // 基本路径
    // build时构建文件的目录 构建时传入 --no-clean 可关闭该行为
    outputDir: 'dist',
    // build时放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
    assetsDir: './',
    // 指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径。
    indexPath: 'index.html',
    // 默认在生成的静态资源文件名中包含hash以控制缓存
    filenameHashing: true,
    // 是否在开发环境下通过 eslint-loader 在每次保存时 lint 代码 (在生产构建时禁用 eslint-loader)
    lintOnSave: process.env.NODE_ENV !== 'production',
    // lintOnSave: true,
    publicPath: IS_PROD ? './' : './',
    // 是否使用包含运行时编译器的 Vue 构建版本
    runtimeCompiler: false,
    // Babel 显式转译列表
    transpileDependencies: [],
    // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建
    productionSourceMap: productionSourceMap,
    // webpack配置
    // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
    chainWebpack: (config) => {
        config.resolve.symlinks(true) // 修复热更新失效
        config.resolve.alias
            .set('@', resolve('src'))
            .set('static', resolve('static'))
            .set('styles', resolve('src/styles'))
            .set('components', resolve('src/components'))
            .set('utils', resolve('src/utils'))
            .set('views', resolve('src/views'))
    },
    configureWebpack: (config) => {
        if (process.env.NODE_ENV === 'production') {
            // 为生产环境修改配置...
            // config.mode = 'production'
            // 打包去掉注释以及console
            config.plugins = config.plugins.concat(
                [
                    new UglifyJsPlugin({
                        uglifyOptions: {
                            warnings: false,
                            compress: {
                                drop_debugger: true,
                                drop_console: true
                            }
                        }
                    })
                ]
            )
            // 防止将某些 import 的包(package)打包到 bundle 中，而是在运行时(runtime)再去从外部获取这些扩展依赖
            // config.externals = {
            //   'vue': 'Vue',
            //   'element-ui': 'ELEMENT',
            //   'vue-router': 'VueRouter',
            //   'vuex': 'Vuex',
            //   'axios': 'axios'
            // }
            // 2. 构建时开启gzip，降低服务器压缩对CPU资源的占用，服务器也要相应开启gzip
            config.plugins.push(new CompressionWebpackPlugin({
                algorithm: 'gzip',
                test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
                threshold: 10240,
                minRatio: 0.8
            }))
        } else {
            // 为开发环境修改配置...
            config.mode = 'development'
        }
        // 引入plugins
        config.plugins = config.plugins.concat(
            [
                new webpack.ProvidePlugin({
                    // $: 'jquery'
                })
            ]
        )
    },
    // css相关配置
    css: {
        // 是否使用css分离插件 ExtractTextPlugin
        extract: IS_PROD,
        // 为css后缀添加hash
        // extract: {
        // filename: 'css/[name].[hash:8].css',
        // chunkFilename: 'css/[name].[hash:8].css'
        // },
        // 开启 CSS source maps?
        sourceMap: !IS_PROD,
        // css预设器配置项
        loaderOptions: {},
        // 启用 CSS modules for all css / pre-processor files.
        modules: false
    },
    // use thread-loader for babel & TS in production build
    // enabled by default if the machine has more than 1 cores
    parallel: require('os').cpus().length > 1,
    // PWA 插件相关配置
    // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
    pwa: {},
    // webpack-dev-server 相关配置
    devServer: {
        open: process.platform === 'darwin',
        host: '0.0.0.0',
        port: 9090,
        hot: true,
        https: false,
        hotOnly: false,
        overlay: {
            warnings: true,
            errors: true
        },
        proxy: {
            '/api': {
                target: 'http://api.16690.meidie.cn', // 接口的域名
                secure: false, // 如果是https接口，需要配置这个参数
                changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
                pathRewrite: {
                    '^/api': '/api'
                }
            }
        },
        // eslint-disable-next-line no-unused-vars
        before: (app) => {}
    },
    // 第三方插件配置
    pluginOptions: {}
}
module.exports = option
